<template>
  <div ref="strends" style=" width: 105%; height: calc(100vh - 410px) "></div>
</template>
  
<script>
import * as echarts from "echarts/core";
import {
  TitleComponent,
  TooltipComponent,
  GridComponent,
  VisualMapComponent,
} from "echarts/components";
import { LineChart } from "echarts/charts";
import { UniversalTransition } from "echarts/features";
import { CanvasRenderer } from "echarts/renderers";
import { getShowOne } from "@/apis/dataSreening/salesData";

echarts.use([
  TitleComponent,
  TooltipComponent,
  GridComponent,
  VisualMapComponent,
  LineChart,
  CanvasRenderer,
  UniversalTransition,
]);

export default {
  mounted() {
    this.drawcontinuous();
  },
  methods: {
    drawcontinuous() {
      var chartDom = this.$refs.strends;
      var myChart = echarts.init(chartDom);
      var option;
      getShowOne()
        .then(({data}) => {
          // prettier-ignore
    
          const dateList =data.day;
          const valueList = data.value.filter(v => v !== 0);
          option = {
            title: {
              text: "产奶趋势",
              // top:20,
              // left:"35%"
            },
            xAxis: {
              type: 'category',
              data: dateList
            },
            yAxis: {
              type: 'value'
            },
            series: [
              {
                data:valueList ,
                type: 'line',
                smooth: true
              }
            ]
          };


          myChart.setOption(option);
        })
        .catch(() => { });
    },
  },
};
</script>
  
<style></style>